<template>
<div >
    <div id="box">
       <div class="center" v-for="(item,index) in detailListb" :key="item.id">
        <dt>
           <strong>{{endTime(index)}}/</strong>
           <!-- <p>05-07</p> -->
        </dt>
        <dd>
            <h3>{{ item.sch_name }}</h3>
            <p>{{item.city_name}} | {{item.venue_name}}</p>
             <p>
        <span>￥{{ item.min_price}}</span>
        <span>起</span>
      </p>
        </dd>
        </div>
    </div>
</div>
</template>

<script>
import {mapState} from 'vuex'
import Vue from 'vue'
export default {
 data () {
return {
}
 },
 computed:{
     ...mapState('detaillistb',['detailListb']),
     endTime(){
            return function(index){
                let endTim=this.detailListb[index].end_time*1000;
                let startTim=this.detailListb[index].start_time*1000;
                let endTime=new Date(endTim)
                let endstr='';
                endstr=endTime.getFullYear()+'.'+endTime.getMonth()+"."+endTime.getDate()
                let startTime=new Date(startTim)
                let startstr='';
                startstr=startTime.getFullYear()+'.'+startTime.getMonth()+"."+startTime.getDate()
                return startstr+'-'+endstr
            }
        }
 },
 mounted () {
}
}
</script>

<style scoped>
body,html,#box{
    background:rgba(192,192,192);
}
.center{
    display: flex;
    justify-content: space-between;
    position:relative;
    margin-top:10px;

}
dt{
     width: 3.93333rem;
    border-radius: 0.10667rem 0px 0px 0.10667rem;
    color: #232323;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff;
}
dt strong{
    font-size: 0.31333rem;
    font-weight: normal;
    text-align: center;
}
dt p{
    font-size: 0.3rem;
}
dd{
    width: 5.13333rem;
    border-radius: 0px 0.10667rem 0.10667rem 0px
}
h3{
    font-size: 0.32667rem;
    color: #232323;
    line-height: 0.58667rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: normal;
}
dd
{
    width:5.13333rem;
    background: #fff;
    margin-left: 0.1rem;
}
dd p{
    font-size: 0.27333rem;
    color: #666;
    margin-top: 0.18667rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
p span:nth-child(1){
    color: #FF6743;
    font-size: 0.32667rem;
    margin-right: 0.13333rem;
    font-weight: 500;
}
</style>
